import { createApp } from 'vue'
import App from './App.vue'
const app = createApp(App)

// Pinia
import { createPinia } from 'pinia'
app.use(createPinia())

// Router
import Router from './router'
app.use(Router)

// Element-Plus
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn'
app.use(ElementPlus, { size: 'default', locale: zhCn })

// Element-Icons
import * as ElIcons from '@element-plus/icons-vue'
import 'element-plus/dist/index.css'
for (const [key, component] of Object.entries(ElIcons)) {
  const temp: string = key.replace(/([A-Z])/g, '-$1').toLowerCase()
  app.component('el-icon' + temp, component)
}

// E-Icon-Picker
import eIconPicker from 'e-icon-picker'
import 'font-awesome/css/font-awesome.min.css'
import 'src/assets/scss/iconPicker.scss'
app.use(eIconPicker, { FontAwesome: true })

// Global Directive
import directive from './plugin/directive'
directive(app)

// Global Component
import AutumnArea from 'src/component/area/index.vue'
import AutumnSearch from 'src/component/search/index.vue'
import AutumnTable from 'src/component/table/index.vue'
import AutumnTreeSelect from 'src/component/treeselect/index.vue'
app.component(AutumnArea.name, AutumnArea)
app.component(AutumnSearch.name, AutumnSearch)
app.component(AutumnTable.name, AutumnTable)
app.component(AutumnTreeSelect.name, AutumnTreeSelect)

// 绑定DOM
app.mount('#app')

// Global CSS
import '@logdna/nprogress/nprogress.css'
import './assets/scss/global.scss'

// Global Province/City/Area
import { provinceAndCityData, regionData } from 'element-china-area-data'
localStorage.setItem('provinceAndCityData', JSON.stringify(provinceAndCityData))
localStorage.setItem('regionData', JSON.stringify(regionData))
